<template>
	<view class="quan">
		<!-- 头部 -->
		<view class="top">
			<image src="/static/mybeijing.png" class="top_bj_img" />
			<view class="top_nav">
				<view class="top_center">我的</view>
				<view class="top_right" @click="register"></view>
			</view>
		</view>
		<!-- 申请登录浮动框 -->
		<view class="float">
			<!-- 上部头像及信息 -->
			<view class="float_tatal">
					<!-- 头像 -->
					<view class="head_img"> 
						<image :src="wz+meminfo.headimg"  class="img"/>
					</view>
					<!-- 信息 -->
					<view class="right">
						<view class="right_top">
							<view class="name">{{meminfo.tname}}</view>
							<view class="tel">{{meminfo.phone}}</view>
							<image class="right_icon" src="/static/right.png"/>
						</view>
						<view class="right_center">
								<!-- <image class="icon_id" src="/static/id1.png" /> -->
								<view class="id">会员等级：{{level}}</view>
						</view>
					</view>
			</view>
			<!-- 余额和积分 -->
			<view class="float_foot">
				<view class="foot_left" @tap="yue1">
					易货劵<span style="font-weight: bold;padding-left: 20upx; color:#000000"> ¥{{memassets.money}} </span>
				</view>
				<view class="foot_right" @tap="jifen1">
					积分<span style="font-weight: bold;padding-left: 20upx; color:#000000">{{memassets.give}} </span>
				</view>
			</view>
		</view>
		<!-- 我的订单 -->
		<view class="my_Order">
			<view class="Order_top">我的订单</view>
			<view class="Order_list" v-for="(item,index) in fenlei" :key="index" @click="orderBtn(item.num)">
					<image class="c_img1" :src="item.icon"></image><!-- 循环中的src前带分号 -->
					<view class="c_name" >{{item.name}}</view>
			</view>
				
				
		</view>
			<!-- 我的中心 -->
			<view class="my_core">
				<view class="core_top">我的中心</view>
				<view class="core_center">
				<view class="core_list" v-for="(item,index) in zhongxin" :key="index" @click="coreBtn(item.id)">
							<image class="c_img1" :src="item.icon"></image><!-- 循环中的src前带分号 -->
							<view class="c_name" >{{item.name}}</view>
					</view>
					
				</view>
				</view>
				<form @submit="tuichu" >
				<view class="btn"><button type="primary" form-type="submit">退出登录</button></view>
				</form>
		</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				login: 1,
				see: true,
				tel:'',
				wz:'http://tuiguang.yiyunoto.com',
				yue:'0.0',
				jifen:'0.0',
				level:'',
				// 我的订单分类数据
				fenlei:[{icon:'/static/fukuan.png',name:'待付款',id:'/Order/index',num:'1'},{icon:'/static/fahuo.png',name:'待发货',id:'/Order/index',num:'2'},{icon:'/static/shouhuo.png',name:'待收货',id:'/Order/index',num:'3'},{icon:'/static/wancheng.png',name:'已完成',id:'/Order/index',num:'4'},{icon:'/static/tuihuo.png',name:'退货中',id:'/Order/index',num:'5'}],
				// 我的中心分类数据中心
				zhongxin:[{icon:'/static/tongxing.png',name:'我的余额',id:'/Pass_check/index'},{icon:'/static/qiquan.png',name:'我的期权',id:'/My_options/index'},{icon:'/static/bank.png',name:'银行卡',id:'/list_bank/list_bank'},{icon:'/static/yaoqing.png',name:'我的邀请',id:'/Invitation/index'},{icon:'/static/dizhi.png',name:'收货地址',id:'/address/address'},{icon:'/static/gouwubi.png',name:'购物币',id:'/Shopping_currency/Shopping_currency'},{icon:'/static/student.png',name:'商学院',id:'/School/School'}],
				yhxx:'',
				meminfo:'',
				memassets:'',
				IdNumber:"",
				IdNumber1:"",
				num:"123456",
			}
		},
		onLoad() {
		 uni.showLoading({
		     title: '拼命加载中'
		 });
			 uni.request({
				url:'http://tuiguang.yiyunoto.com/api/member/index',
				header:{authtoken:this.$store.state.token},
				method:'POST',
				success:(res)=>{
					console.log("请求成功",res)
					this.meminfo=res.data.data.meminfo
					this.memassets=res.data.data.memassets
					this.IdNumber = res.data.data.meminfo.carid
					this.level=this.userLevel(res.data.data.meminfo.level)
					uni.hideLoading()
				},
				fail:(res)=>{
					console.log("请求失败",res)
				}
			})	
		},
		onShow() {
			uni.request({
				url:'http://tuiguang.yiyunoto.com/api/member/index',
				header:{authtoken:this.$store.state.token},
				method:'POST',
				success:(res)=>{
					console.log("请求成功",res)
					this.meminfo=res.data.data.meminfo
					this.memassets=res.data.data.memassets
					this.level=this.userLevel(res.data.data.meminfo.level)
					 uni.stopPullDownRefresh();	 
				},   
				fail:(res)=>{
					console.log("请求失败",res)
				}
			})
		},
		methods: {
			// 会员等级
			userLevel(level){
				switch(level){
					case 6:this.level="合伙人";break;
					case 5:this.level="代理商";break;
					case 4:this.level="商家";break;
					case 3:this.level="白金会员";break;
					default:this.level="普通会员";break;
				}
				return this.level
			},
			// 隐藏身份证号
			plusXing (str,frontLen,endLen) { 
			var len = str.length-frontLen-endLen;
			var xing = '';
			for (var i=0;i<len;i++) {
			xing+='*';
			}
			return str.substring(0,frontLen)+xing+str.substring(str.length-endLen);
			},
			
			onPullDownRefresh: function() {
				uni.request({
					url:'http://tuiguang.yiyunoto.com/api/member/index',
					header:{authtoken:this.$store.state.token},
					method:'POST',
					success:(res)=>{
						console.log("请求成功",res)
						this.meminfo=res.data.data.meminfo
						this.memassets=res.data.data.memassets
						this.IdNumber = res.data.data.meminfo.carid
						this.level=this.userLevel(res.data.data.meminfo.level)
						 uni.stopPullDownRefresh();	 
					},   
					fail:(res)=>{
						console.log("请求失败",res)
					}
				})
			},
			yue1:function(){
				uni.navigateTo({
					url:'../balance/balance'
				})
			},
			jifen1:function(){
				uni.navigateTo({
					url:'../My_points/index'
				})
			},
			orderBtn:function(e){
				console.log("抢购商品",e);
				uni.navigateTo({
					url:"../Order/index?num="+e
				})
			},
			coreBtn:function(e){
				console.log("抢购商品",e);
				uni.navigateTo({
					url:".."+e
				})
			},
			tuichu(){
				uni.showModal({
				    title: '提示',
				    content: '确认退出？',
				    success:(res)=>{
				        if (res.confirm) {  
				           this.$api.msg("退出成功！");
				           try {
				               uni.removeStorageSync('login')
							   uni.redirectTo({
							   	url:'../login/login'
							   })
				           } catch (e) {
				               // error
				           }
				          
				        }
				    }
				});
			},
			
			}
		}
	
</script>

<style>
	.quan{
		background:#f5f4f9;
		padding-bottom: 200upx;
	}
	.top {
		width: 100%;
		height: 400upx;
	}

	.top_bj_img {
		width: 100%;
		height: 100%;
	}

	.top_nav {
		width: 100%;
		height: 100upx;
		position: absolute;
		top: 20upx;
		padding-left: 20upx;
		padding-top: 50upx;
		box-sizing: border-box;
	}
	.top_center{
		margin: 10upx;
		width:85%;
		float: left;
		padding-left: 60upx;
		text-align: center;
		color:#FFFFFF;
		box-sizing: border-box;
	}
	.top_right{
		float: right;
		width: 60upx;
		height: 60upx;
		margin-right: 20upx;
		color:#FFFFFF;
	}
	
	.float {
		width: 90%;
		border-radius: 10upx;
		margin-left: 5%;
		padding-bottom: 50upx;
		position: relative;
		top: -200upx;
		background: #FFFFFF;
	}
	.float_tatal{
		width:100%;
		height:204upx ;
	}
	.head_img{
		width:130upx;
		height:130upx;
		padding: 30upx;
		float: left;
	}
	.img{
		width:130upx;
		height: 130upx;
		border-radius: 50%;
	}
	.right{
		width:70%;
		height: 100%;
		float: left;
	}
	.right_top{
		width:100%;
		height: 50%;
		padding-top:20upx;
		
	}
	.name{
		font-size: 30upx;
		font-weight: bold;
		float: left;
		padding: 20upx 20upx;
	}
	.tel{
		color:#A9A9A9;
		font-size: 28upx;
		float:left;
		padding: 22upx 0upx;
	}
	.right_icon{
		width:13upx;
		height: 24upx;
		float: right;
		padding: 22upx 20upx;
	}
	.right_center{
		width:100%;
		padding-left:20upx;
	}
	.icon_id{
		width:37upx;
		height: 30upx;
		padding-right: 20upx;
		float: left;
	}
	.id{
		color:#ffd136;
		font-size: 30upx;	
	}
	.float_foot{
		width:100%;
		padding:20upx 0upx;
	}
	.foot_left{
		width: 45%;
		text-align: center;
		color: #868686;
		font-size: 30upx;
		float: left;
		border-right: #639BF6 solid 4upx;
	}
	.foot_right{
		width: 45%;
		text-align: center;
		color: #868686;
		font-size: 30upx;
		float: left;
	}
	.my_Order{
		width: 90%;
		border-radius: 10upx 10upx 0upx 0upx ;
		margin-left: 5%;
		padding-bottom: 50upx;
		position: relative;
		top:-160upx;
		background: #FFFFFF;
	}
	.Order_top{
		width: 90%;
		height: 50upx;
		padding: 20upx;
		margin-left: 2%;
		border-bottom: 2upx solid #F0F0F0;
		/* box-sizing: border-box; */
	}
	.Order_list{
		margin-top:50upx ;
		width: 20%;
		float: left;
		box-sizing: border-box;
		background: #FFFFFF;
	}
	
	.c_img1{
		width:60upx ;
		height:60upx;
		margin:0upx 38upx;
	}
	.c_name{
		font-size:26upx ;
		text-align: center;
		color: #656565;
		padding: 20upx 0upx 30upx 0upx;
	}
	.my_core{
		width: 90%;
		border-radius: 10upx 10upx 0upx 0upx ;
		margin-left: 5%;
		padding-bottom: 50upx;
		position: relative;
		top:-160upx;
		background: #FFFFFF;
	}
	.core_top{
		width: 90%;
		height: 50upx;
		padding: 20upx;
		margin-left: 2%;
		margin-top: 200upx;
		border-bottom: 2upx solid #F0F0F0;
		/* box-sizing: border-box; */
	}
	.core_center{
		width: 90%;
		height:400upx;
		padding: 0upx 20upx;
		
		background: #FFFFFF;
	}
	.core_list{
		width: 20%;
		float: left;
		padding-top: 50upx;
		box-sizing: border-box;
		background: #FFFFFF;
	}
	
	.core_img1{
		width:60upx ;
		height:60upx;
		margin:0upx 38upx;
	}
	.core_name{
		font-size:26upx ;
		text-align: center;
		color: #656565;
		padding: 20upx 0upx 30upx 0upx;
	}
	.btn{
		width: 80%;
		margin: 0 auto;
	}
</style>
